<template>
	<view id="app">
		
		<!-- 信息 -->
		<view class="bw ptb30" @click="details">
			<view class="layoutw90df">
				<image src="/static/logo.png" class="wh110 br10"></image>
				<view class="df dfsb aic w80p">
					<view class="f34 fwb c333 lh50">神州通信器材<br/><text class="c999 f26 fw500">13856241542</text></view>
					<view class="df aic">
						<view class="f28 c666 mr10"> 商家资料 </view>
						<Icons type="right" color="c666" class="f34"></Icons>
					</view>
				</view>
			</view>
		</view>
		
		<!-- nav -->
		<view class="df dfsb bw tr05">
			<view class="w50p tac pr fwb ptb30 tr05 f32" v-for="(item,index) in sytx" :key="index" @click="tx(index)" :class="(index == i)? 'c333':'c999'">{{item.name}}
				<view class="pa w100p b0 br100 bFF9646 bw tr05" :class="index == i?'h8':'h0 oh op0'"></view>
			</view>
		</view>
		
		<!-- 未成交页 -->
		<view class="" >
			<!-- v-if="i == 0" -->
			<!-- nav -->
			<view class="df dfsb w70p mauto">
				<view class="w50p tac pr fwb ptb20 tr05" v-for="(item,index) in sytx2" :key="index" @click="tx2(index)" :class="(index == i2)? 'cFF9646':'c666'">{{item.name}}
					<view class="pa w30p l35p cFF9646 bd1s b0 br100 bFF9646 bw tr05" :class="index == i2?'h8':'h0 oh op0'"></view>
				</view>
			</view>
			
			
			<!-- 商品 -->
			<view class="bw mt30 w93p mauto br4">
				<view class="mlr20">
					<view class="df dfsb aic ptb20 f28 bdb1sE">
						<text class="c666">投标时间：2021-10-20  15:30</text>
						
						<view class="" v-if="i == 0">
							<text class="cFF9646">未确认</text>
							<text class="cFF9646">已结束</text>
						</view>
						
						<view class="" v-else>
							<text class="cFF9646">待支付</text>
							<text class="cFF9646">已支付</text>
							<text class="cFF9646">已完成</text>
						</view>
					</view>
					<view class="df dfsb ptb30 bdb1sE">
						<image src="/static/2867.png" class="wh160 br4"></image>
						<view class="f30 fwb c333 w70p lh45">
							<view class="t2hd">95新 华为Mate Xs/mate X2 5G折叠屏手机</view>
							<view class="cFF9646 f30 lh60 df dfsb w80p">
								<text>￥3000</text>
								<text>保证金:￥600</text>
							</view>
						</view>
					</view>
					<view class="df dfr tac lh60 mt20 f28 fww">
						<view class="w21p ml20 bd1sa br4 c666 mb20" @click="but(1)">联系用户</view>
						<view class="w21p ml20 br4 c333 bDFF6D9 mb20" @click="but(2)">查看详情</view>
						<view class="w21p ml20 bd1sa br4 c666 mb20" @click="but(2)">查看详情</view>
						<view class="w21p ml20 br4 c333 bDFF6D9 mb20" @click="but(3)">确认支付</view>
						<view class="w21p ml20 br4 c333 bDFF6D9 mb20" @click="but(4)">确认收货</view>
						<view class="w21p ml20 br4 c333 bDFF6D9 mb20" @click="but(5)">商品上架</view>
					</view>
				</view>
			</view>
			
			
		</view>
		
		<!-- 已成交 -->
		<view class="" >
			
		</view>
		
		
		
	</view>
</template>

<script>
	
	// 定义全局变量
	var that;
	
	// 默认
	export default {
		
		// 定义页面变量
		data() {
			
			return {
				
				i: 0,
				sytx: [{
						name: '未成交',
					},
					{
						name: '已成交',
					}
				],
				
				sytx2: [{
						name: '全部',
					},
					{
						name: '未确认',
					},
					{
						name: '已结束',
					}
				],
				i2: 0,
				
				// 建立页面参数
				param:{},
				
				// 建立页面变量
				pages:{
					
					
					
				},
				
				// 建立页面数据
				info:{},
				
			}
			
		},
		
		// 获取后
		onLoad() {
			
			// 赋值
			that = this ;
			
		},
		
		// 显示后
		onShow() {
			
		},

		// 方法列表
		methods: {
		
			// 商家资料
			details(){
				uni.navigateTo({
					url:'/pages/task/businessdetails',
				})
			},
			
			// nav 下标
			tx(e) {
				that.i = e;
				if(e == 0){
					that.sytx2 = [
						{ name: '全部', },
						{ name: '未确认', },
						{ name: '已结束', },
					]
				}else{
					that.sytx2 = [
						{ name: '全部', },
						{ name: '待支付', },
						{ name: '已支付', },
						{ name: '已完成', },
					]
				}
			},
			
			// nav 下标
			tx2(e) {
				that.i2 = e;
			},
			
			// 1联系用户 2查看详情 3确认支付 4确认收货 5商品上架
			but(e){
				
				if(e == 1){
					
					return
				}
				if(e == 2){
					uni.navigateTo({
						url:'/pages/my/details',
					})
					return
				}
				if(e == 3){
					
					return
				}
				if(e == 4){
					
					return
				}
				if(e == 5){
					
					return
				}
				
			}
			
		},

	}
</script>

<style>


</style>
